<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
		<script src="js/vue.min.js" type="text/javascript" charset="utf-8"></script>
	</head>
	<body>
		<div id="container">
			<ul>
				<span>
					<hr />
					字符串数组
				</span>
				<li v-for="book in books">{{book}}</li>
				<span>
					<hr />
					对象数组
				</span>
				<li v-for="me in mes">{{me.name}}----->>>{{me.addr}}</li>
				<span>
					<hr />
					索引
				</span>
				<li v-for="(me,index) in mes">{{index}}: {{me.name}}----->>>{{me.addr}}</li>
				<span>
					<hr />
					遍历对象
				</span>
				<li v-for="(hou,key,index) in house">{{index}}--->{{key}}: {{hou}}</li>
			</ul>
		</div>
		<script type="text/javascript">
			var app = new Vue({
				el: "#container",
				data: {
					books: ["html", "java", "script", "python"],
					mes: [{
							name: "zhangsan",
							addr: "shanghai"
						},
						{
							name: "zhangsan",
							addr: "shanghai"
						},
						{
							name: "zhangsan",
							addr: "shanghai"
						}
					],
					house: {
						price: 123,
						size: 3525,
						isHave: false
					}
				}
			})
		</script>
	</body>
</html>
